import 'package:flutter/material.dart';

import 'package:get/get.dart';

import '../controllers/user_controller.dart';
import '../../../services/screebAdapter.dart';
import '../../../services/ityingFonts.dart';

class UserView extends GetView<UserController> {
  const UserView({Key? key}) : super(key: key);
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0,
        actions: [
          Row(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              const Text('会员码'),
              IconButton(
                  onPressed: () {}, icon: const Icon(Icons.qr_code_outlined)),
              IconButton(
                  onPressed: () {}, icon: const Icon(Icons.settings_outlined)),
              IconButton(
                  onPressed: () {}, icon: const Icon(Icons.message_outlined)),
            ],
          ),
        ],
        centerTitle: true,
      ),
      body: ListView(
        padding: EdgeInsets.all(ScreenAdapter.width(40)),
        children: [
          // 登录注册
          Obx(() => controller.isLogin.value
              ? Container(
                  padding: EdgeInsets.only(left: ScreenAdapter.width(60)),
                  // 头像
                  child: Row(
                    children: [
                      SizedBox(
                        height: ScreenAdapter.width(150),
                        width: ScreenAdapter.width(150),
                        child: CircleAvatar(
                          radius: ScreenAdapter.width(75),
                          backgroundImage:
                              const AssetImage("assets/images/user.png"),
                        ),
                      ),
                      Container(
                        padding: EdgeInsets.only(
                            left: ScreenAdapter.width(40),
                            right: ScreenAdapter.width(40)),
                        child: Column(
                          crossAxisAlignment: CrossAxisAlignment.start,
                          children: [
                            // 用户名
                            Text(
                              (controller.userInfo.value.username) as String,
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(46),
                                  color: Colors.black54),
                            ),
                            // 会员等级
                            Text(
                              "普通会员",
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(46),
                                  color: Colors.black54),
                            )
                          ],
                        ),
                      ),
                      Icon(
                        Icons.arrow_forward_ios,
                        size: ScreenAdapter.fontSize(34),
                        color: Colors.black54,
                      )
                    ],
                  ),
                )
              : Container(
                  padding: EdgeInsets.only(left: ScreenAdapter.width(60)),
                  // 头像
                  child: InkWell(
                    onTap: () {
                      Get.toNamed('/code-login-step-one');
                    },
                    child: Row(
                      children: [
                        SizedBox(
                          height: ScreenAdapter.width(150),
                          width: ScreenAdapter.width(150),
                          child: CircleAvatar(
                            radius: ScreenAdapter.width(75),
                            backgroundImage:
                                const AssetImage("assets/images/user.png"),
                          ),
                        ),
                        Container(
                          padding: EdgeInsets.only(
                              left: ScreenAdapter.width(40),
                              right: ScreenAdapter.width(40)),
                          child: Text(
                            '登录/注册',
                            style: TextStyle(
                                fontSize: ScreenAdapter.fontSize(46),
                                color: Colors.black54),
                          ),
                        ),
                        Icon(
                          Icons.arrow_forward_ios,
                          size: ScreenAdapter.fontSize(34),
                          color: Colors.black54,
                        )
                      ],
                    ),
                  ),
                )),
          // 优惠信息
          Obx(() => Container(
                margin: EdgeInsets.only(top: ScreenAdapter.height(60)),
                height: ScreenAdapter.height(160),
                child: Row(
                  children: [
                    Expanded(
                        flex: 1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '${controller.userInfo.value.gold}',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(80),
                                  fontWeight: FontWeight.bold,
                                  color: Colors.black38),
                            ),
                            Text(
                              '米金',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black38),
                            )
                          ],
                        )),
                    Expanded(
                        flex: 1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '${controller.userInfo.value.coupon}',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(80),
                                  fontWeight: FontWeight.bold,
                                  color: Colors.black38),
                            ),
                            Text(
                              '优惠券',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black38),
                            )
                          ],
                        )),
                    Expanded(
                        flex: 1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '${controller.userInfo.value.redPacket}',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(80),
                                  fontWeight: FontWeight.bold,
                                  color: Colors.black38),
                            ),
                            Text(
                              '红包',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black38),
                            )
                          ],
                        )),
                    Expanded(
                        flex: 1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            Text(
                              '${controller.userInfo.value.quota}',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(80),
                                  fontWeight: FontWeight.bold,
                                  color: Colors.black38),
                            ),
                            Text(
                              '最高额度',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black38),
                            )
                          ],
                        )),
                    Expanded(
                        flex: 1,
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.spaceBetween,
                          children: [
                            const Icon(Icons.bookmark_outline),
                            Text(
                              '钱包',
                              style: TextStyle(
                                  fontSize: ScreenAdapter.fontSize(34),
                                  color: Colors.black38),
                            )
                          ],
                        )),
                  ],
                ),
              )),
          // 广告
          SizedBox(
            child: Container(
              margin: EdgeInsets.only(top: ScreenAdapter.height(60)),
              width: ScreenAdapter.width(1008),
              height: ScreenAdapter.width(300),
              decoration: BoxDecoration(
                  image: const DecorationImage(
                      image: AssetImage('assets/images/user_ad1.png'),
                      fit: BoxFit.fitWidth),
                  borderRadius: BorderRadius.circular(ScreenAdapter.width(20))),
            ),
          ),
          // 订单信息
          Container(
            margin: EdgeInsets.only(top: ScreenAdapter.height(50)),
            padding: EdgeInsets.all(ScreenAdapter.width(40)),
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(ScreenAdapter.width(20))),
            child: Column(
              children: [
                Container(
                  height: ScreenAdapter.height(100),
                  padding: EdgeInsets.all(ScreenAdapter.width(10)),
                  decoration: const BoxDecoration(
                      border: Border(
                          bottom: BorderSide(color: Colors.black26, width: 1))),
                  child: Row(
                    children: [
                      const Expanded(
                          flex: 1,
                          child: Text(
                            '收藏',
                            textAlign: TextAlign.center,
                          )),
                      Expanded(
                          flex: 1,
                          child: Container(
                            alignment: Alignment.center,
                            decoration: const BoxDecoration(
                                border: Border(
                              left: BorderSide(color: Colors.black26, width: 1),
                              right:
                                  BorderSide(color: Colors.black26, width: 1),
                            )),
                            child: const Text('足迹'),
                          )),
                      const Expanded(
                          flex: 1,
                          child: Text(
                            '关注',
                            textAlign: TextAlign.center,
                          )),
                    ],
                  ),
                ),
                Padding(
                  padding: EdgeInsets.only(
                      left: ScreenAdapter.width(20),
                      right: ScreenAdapter.width(20)),
                  child: Divider(
                    height: ScreenAdapter.height(2),
                    color: Colors.black12,
                  ),
                ),
                Container(
                  padding: EdgeInsets.only(
                      top: ScreenAdapter.height(40),
                      bottom: ScreenAdapter.height(40)),
                  height: ScreenAdapter.height(240),
                  child: Row(
                    children: [
                      Expanded(
                          flex: 1,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              const Icon(Icons.bookmarks_outlined,
                                  color: Colors.black87),
                              Text("待付款",
                                  style: TextStyle(
                                      color: Colors.black87,
                                      fontSize: ScreenAdapter.fontSize(36)))
                            ],
                          )),
                      Expanded(
                          flex: 1,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              const Icon(Icons.car_crash,
                                  color: Colors.black87),
                              Text("待收货",
                                  style: TextStyle(
                                      color: Colors.black87,
                                      fontSize: ScreenAdapter.fontSize(36)))
                            ],
                          )),
                      Expanded(
                          flex: 1,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              const Icon(
                                Icons.question_answer_outlined,
                                color: Colors.black87,
                              ),
                              Text("待评价",
                                  style: TextStyle(
                                      color: Colors.black87,
                                      fontSize: ScreenAdapter.fontSize(36)))
                            ],
                          )),
                      Expanded(
                          flex: 1,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              const Icon(Icons.design_services_outlined,
                                  color: Colors.black87),
                              Text("退换/售后",
                                  style: TextStyle(
                                      color: Colors.black87,
                                      fontSize: ScreenAdapter.fontSize(36)))
                            ],
                          )),
                      Expanded(
                          flex: 1,
                          child: Column(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              const Icon(Icons.copy_all_rounded,
                                  color: Colors.black87),
                              Text("全部订单",
                                  style: TextStyle(
                                      color: Colors.black87,
                                      fontSize: ScreenAdapter.fontSize(36)))
                            ],
                          )),
                    ],
                  ),
                ),
              ],
            ),
          ),

          // 服务
          Container(
            margin: EdgeInsets.only(top: ScreenAdapter.width(50)),
            decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(ScreenAdapter.width(20))),
            child: Column(
              children: [
                Row(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    Padding(
                      padding: EdgeInsets.all(ScreenAdapter.height(28)),
                      child: Text("服务",
                          style: TextStyle(
                              color: Colors.black87,
                              fontSize: ScreenAdapter.fontSize(44),
                              fontWeight: FontWeight.bold)),
                    ),
                    const Text(
                      "更多 > ",
                      style: TextStyle(color: Colors.black54),
                    )
                  ],
                ),
                GridView.count(
                  shrinkWrap: true, // 收缩
                  physics: const NeverScrollableScrollPhysics(), //禁止滑动
                  crossAxisCount: 4,
                  childAspectRatio: 1.25,
                  children: <Widget>[
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(
                          ItyingFonts.anzhuangyewu,
                          color: Colors.blue,
                        ),
                        Text("一键安装")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(ItyingFonts.anzhuangyewu, color: Colors.orange),
                        Text("一键退换")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(ItyingFonts.weixiu, color: Colors.purple),
                        Text("一键维修")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(ItyingFonts.schedule, color: Colors.orange),
                        Text("服务进度")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(
                          ItyingFonts.xiaomi,
                          color: Colors.orange,
                        ),
                        Text("小米之家")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(
                          ItyingFonts.kefu,
                          color: Colors.orange,
                        ),
                        Text("客服中心")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(ItyingFonts.duihuan, color: Colors.green),
                        Text("以旧换新")
                      ],
                    ),
                    Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: const [
                        Icon(ItyingFonts.chongdian, color: Colors.green),
                        Text("手机电池")
                      ],
                    ),
                  ],
                ),
              ],
            ),
          ),
        ],
      ),
    );
  }
}
